(function($, win){
  $(function(){
    // 点击左侧
    $('.pagination-item').on('click',function(){
      var index = $(this).index();
      win.localStorage.setItem('index', index);
    })
    //鼠标移入左侧导航
    $('.pagination-item').on('mouseenter', function(){
      $(this).find('a').stop().animate({
        right: "-30%"
      },500);
      $(this).find('.pagination-item-text img').stop().show(500);
    })
    $('.pagination-item').on('mouseleave', function(){
      $(this).find('a').stop().animate({
        right: "-55%"
      },500);
      $(this).find('.pagination-item-text img').stop().hide(500);
    })
    var index = 0;
    //上一页
    $('.pre').on('click',function(){
      if(index == 0){
        return
      }
      index--;
      var loop = -100 * index + "%"
      $('.about-warp').animate({
        marginLeft: loop
      }, 1000);
      $('.about-nav').children().eq(index).addClass('active').siblings().removeClass('active')
    })
    //下一页
    $('.next').on('click',function(){
      if(index==3){
        return
      }
      index++;
      var loop = -100 * index +"%"
      $('.about-warp').animate({
        marginLeft: loop
      }, 1000);
      $('.about-nav').children().eq(index).addClass('active').siblings().removeClass('active')
    })
    //底部导航
    $('.about-nav').children().on('click',function(){
      $(this).addClass('active').siblings().removeClass('active')
      var bottomIndex = $(this).index();
      index = bottomIndex;
      var loop = -100 * index + "%"
      $('.about-warp').stop().animate({
        marginLeft: loop
      }, 1000);
    })
  })
})(jQuery, window)
